<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>工资条</title>
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<script src="js/jquery-1.10.1.min.js"></script>
	<link rel="stylesheet" href="css/mui.min.css">
	<link rel="stylesheet" href="css/css.css">
</head>

<body>
<header class="mui-bar mui-bar-nav">
	<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" onClick="javascript:history.back(-1);"></a>
	<h1 class="mui-title">工资条详情</h1>
</header>
<div class="mui-content">
	<div class="main">
		<div class="gz_detail">
			<h3>8435.23</h3>
			<p>本月实发工资</p>
		</div>
		<div class="fsjl_item2 mui-card">
			<div class="f_item_title active">基本工资<span class="mui-icon mui-icon-arrowup"></span></div>
			<div class="item_list show">
				<div class="item">
					<span>基本工资</span>
					10000.00
				</div>
				<div class="item">
					<span>奖金</span>
					50000.00
				</div>
				<div class="item">
					<span>通讯补贴</span>
					0
				</div>
				<div class="item">
					<span>绩效工资</span>
					0
				</div>
				<div class="item">
					<span>加班工资</span>
					0
				</div>
				<div class="item">
					<span>交通补贴</span>
					0
				</div>
			</div>
			<div class="item">
				<span>实发金额（元）</span>
				<div class="amount">8435.23</div>
			</div>
		</div>
		<div class="fsjl_item2 mui-card">
			<div class="f_item_title">绩效奖金<span class="mui-icon mui-icon-arrowup"></span></div>
			<div class="item_list">
				<div class="item">
					<span>基本工资</span>
					10000.00
				</div>
				<div class="item">
					<span>奖金</span>
					50000.00
				</div>
				<div class="item">
					<span>通讯补贴</span>
					0
				</div>
				<div class="item">
					<span>绩效工资</span>
					0
				</div>
				<div class="item">
					<span>加班工资</span>
					0
				</div>
				<div class="item">
					<span>交通补贴</span>
					0
				</div>
			</div>
			<div class="item">
				<span>实发金额（元）</span>
				<div class="amount">8435.23</div>
			</div>
		</div>
	</div>
	<div class="nav but">
		<ul class="mui-table-view mui-grid-view">
			<li class="mui-table-view-cell mui-col-xs-6 active">
				<a href="yiwen.html">我有疑问</a>
			</li>
			<li class="mui-table-view-cell mui-col-xs-6">
				<a class="qr_but">确认工资信息</a>
			</li>
		</ul>	
	</div>
</div>
<div class="pop qr_pop">
	<span class="mui-icon mui-icon-checkmarkempty"></span>
	<p>已确认</p>
</div>
<script>
	$(document).on('click','.f_item_title',function(){
		if($(this).hasClass('active')){
			$(this).removeClass('active').siblings('.item_list').removeClass('show')
		}else{
			$(this).addClass('active').siblings('.item_list').addClass('show')
		}
	})
	$('.qr_but').click(function(){
		$('.qr_pop').fadeIn().delay('3000').fadeOut()
	})
</script>
</body>
</html>